<template>
  <div class="app-container">
    <el-form label-width="120px">
      <el-form-item label="原密码">
        <el-input v-model="oldPassword" type="password"/>
      </el-form-item>

      <el-form-item label="新密码">
        <el-input v-model="newPassword" type="password"/>
      </el-form-item>

      <el-form-item label="确认密码">
        <el-input v-model="confirmPassword" type="password" @input="isPwdSame"/> <span style="color: red">{{ pwdError }}</span>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="update_password">确认修改</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import user from '@/api/hr/user'
export default {
  data() {
    return {
      oldPassword: '',
      newPassword: '',
      confirmPassword: '',
      pwdError: ''

    }
  },
  methods: {
    isPwdSame() {
      if (this.confirmPassword === this.newPassword) {
        this.pwdError = ''
      } else {
        this.pwdError = '确认密码错误'
      }
    },
    update_password() {
      user.updatePassword(this.oldPassword, this.newPassword)
        .then(response => {
          this.$message({
            type: 'success',
            message: '修改成功!'
          })
          this.$router.push({ path: '/dashboard' })
        })
    }
  }
}
</script>

<style scoped>

</style>
